/**
 * 拖拽加载
 */
var dropload = function(params){
    var page = 0;
    var pageSize = 10;
    $('.weui_panel_access').dropload({
        scrollArea : window,
        domDown : {//上拉
            domClass   : 'dropload-down',
            domRefresh : '<div class="dropload-refresh f15 "><i class="icon icon-20"></i>上拉加载更多</div>',
            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>',
            domNoData  : '<div class="dropload-noData">没有更多数据了</div>'
        },
        domUp : {//下拉
            domClass   : 'dropload-up',
            domRefresh : '<div class="dropload-refresh"><i class="icon icon-114"></i>上拉加载更多</div>',
            domUpdate  : '<div class="dropload-load f15"><i class="icon icon-20"></i>释放更新...</div>',
            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>'
        },
        loadUpFn : function(me){//刷新
            $.ajax({
                type: 'GET',
                url:API_URL+GET_PRODUCTINFO_URL+'?page='+page+'&pageSize='+pageSize,
                dataType: 'jsonp',
                data:params,
                success: function(data){
                    var tpl = '';
                    var imgstpl = '';
                    var datas = data.result;
                    for(var i = 0;i<datas.length;i++){
                        var imgs = datas[i].images;
                        for(var j=0;j<imgs.length;j++){
                            imgstpl += '<div class="swiper-slide"><a href=detail.html?id='+datas[i].id+'><img data-img="'+imgs[j].smallUrl+'" src="'+imgs[j].smallUrl+'" /></a></div>';
                        }
                        tpl +='<div class="shop-item" categoryid="'+datas[i].categoryId+'"><div class="shop-head"><div class="title">'+datas[i].categoryName+'</div>'+
                            '<span class="fr">￥'+datas[i].price+'</span></div>'+
                            '<div class="swiper-container"><div class="swiper-wrapper">'+imgstpl+'</div></div>' +
                            '<div class="des-info">'+datas[i].desc+'</div>'+
                            '<div class="fav-message"><a href="#">收藏<em>'+datas[i].favoriteCount+'</em></a><a href="#">留言<em>'+datas[i].commentCount+'</em></a>'+
                            '</div></div>';
                    }
                    // 为了测试，延迟1秒加载
                    setTimeout(function(){
                        $('.shop-list').append(tpl);
                        new Swiper('.shop-list .swiper-container', {
                            slidesPerView: 3,
                            spaceBetween: 10
                        });
                        var lazyloadImg = new LazyloadImg({
                            el: '.shop-list [data-img]', //匹配元素
                            top: 50, //元素在顶部伸出长度触发加载机制
                            right: 50, //元素在右边伸出长度触发加载机制
                            bottom: 50, //元素在底部伸出长度触发加载机制
                            left: 50, //元素在左边伸出长度触发加载机制
                            qriginal: false, // true，自动将图片剪切成默认图片的宽高；false显示图片真实宽高
                            load: function(el) {
                                el.style.cssText += '-webkit-animation: fadeIn 01s ease 0.2s 1 both;animation: fadeIn 1s ease 0.2s 1 both;';
                            },
                            error: function(el) {

                            }
                        });
                        // 每次数据加载完，必须重置
                        me.resetload();
                        // 重置索引值，重新拼接more.json数据
                        page = 0;
                        // 解锁
                        me.unlock();
                        me.noData(false);
                    },1000);
                },
                error: function(xhr, type){
                    console.log('ajax error!');
                    // 即使加载出错，也得重置
                    me.resetload();
                }
            });
        },
        loadDownFn : function(me){//加载更多
            page++;
            window.history.pushState(null, document.title, window.location.href);
            var tpl = '';
            var imgstpl = '';
            $.ajax({
                type: 'GET',
                url:API_URL+GET_PRODUCTINFO_URL+'?page='+page+'&pageSize='+pageSize,
                dataType: 'jsonp',
                data:params,
                success: function(data){
                    var datas = data.result;
                    if(datas.length > 0){
                        for(var i = 0;i<datas.length;i++){
                            var imgs = datas[i].images;
                            for(var j=0;j<imgs.length;j++){
                                imgstpl += '<div class="swiper-slide"><a href=detail.html?id='+datas[i].id+'><img data-img="'+imgs[j].smallUrl+'" src="'+imgs[j].smallUrl+'" /></a></div>';
                            };
                            tpl +='<div class="shop-item" categoryid="'+datas[i].categoryId+'"><div class="shop-head"><div class="title">'+datas[i].categoryName+'</div>'+
                                '<span class="fr">￥'+datas[i].price+'</span></div>'+
                                '<div class="swiper-container"><div class="swiper-wrapper">'+imgstpl+'</div></div>' +
                                '<div class="des-info">'+datas[i].desc+'</div>'+
                                '<div class="fav-message"><a href="#">收藏<em>'+datas[i].favoriteCount+'</em></a><a href="#">留言<em>'+datas[i].commentCount+'</em></a>'+
                                '</div></div>';
                        }
                        // 如果没有数据
                    }else{
                        // 锁定
                        me.lock();
                        // 无数据
                        me.noData();
                    }
                    // 为了测试，延迟1秒加载
                    setTimeout(function(){
                        $('.shop-list').append(tpl);
                        new Swiper('.shop-list .swiper-container', {
                            slidesPerView: 3,
                            spaceBetween: 10
                        });
                        var lazyloadImg = new LazyloadImg({
                            el: '.shop-list [data-img]', //匹配元素
                            top: 50, //元素在顶部伸出长度触发加载机制
                            right: 50, //元素在右边伸出长度触发加载机制
                            bottom: 50, //元素在底部伸出长度触发加载机制
                            left: 50, //元素在左边伸出长度触发加载机制
                            qriginal: false, // true，自动将图片剪切成默认图片的宽高；false显示图片真实宽高
                            load: function(el) {
                                el.style.cssText += '-webkit-animation: fadeIn 01s ease 0.2s 1 both;animation: fadeIn 1s ease 0.2s 1 both;';
                            },
                            error: function(el) {

                            }
                        });
                        //
                        // 每次数据加载完，必须重置
                        me.resetload();
                    },1000);
                },
                error: function(xhr, type){
                    console.log('ajax error!');
                    // 即使加载出错，也得重置
                    me.resetload();
                }
            });
        }
    })
};
